.cb-drawer{
    &-close-content,&-open-content, &-close-content-right,&-open-content-right, &-close-mode ,&-open-mode,&-close-mode-right,&-open-mode-right{
      position: fixed;
      top: 0;
      height: 100%;
    }
    &-close-content,&-open-content,&-close-content-right,&-open-content-right{
      width: 50%;
      background: #fff;
      z-index: 99
    }
    &-open-mode,&-close-mode,&-close-mode-right,&-open-mode-right{
      background: #222222;
      opacity: 0.8;
      z-index: 9;
      width: 100%;
      right: 0;
      left: 0;
    }
    &-close-content{
      opacity:0;
      left: 0%;
      transform: translate3d(-100%, 0, 0);
      transition: all .5s;
    }
    &-open-content{
      opacity:1;
      left: 0%;
      transform: translate3d(0, 0, 0);
      transition:all  .5s;
    }
    &-close-content-right{
      right: -50%;
      transition: right .5s;
    }
    &-open-content-right{
      right: 0;
      transition: right .5s;
    }
    &-close-mode{
      opacity:0;
      transition: opacity .5s;
    }
    &-open-mode{
      opacity: 0.7;
      transition: opacity .5s;
    }
    &-close-mode-right{
      opacity:0;
      transition: opacity .5s;
    }
    &-open-mode-right{
      opacity: 0.7;
      transition: opacity .5s;
    }
  }